<!doctype html>
<html lang="zh">

<head>
	<!-- Required meta tags -->
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<meta name="keywords" content="山西农业大学,成绩查询">
	<meta name="description" content="山西农业大学成绩查询">
	<link rel="shortcut icon" href="images/favicon.ico" />
	<link rel="bookmark" href="images/favicon.ico" type="image/x-icon" />
	<!-- Bootstrap CSS -->
	<link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css">
	<style type="text/css">
		html,
		body {
			height: 100%;
		}

		body {
			display: -ms-flexbox;
			display: flex;
			-ms-flex-align: center;
			align-items: center;
			padding-top: 40px;
			padding-bottom: 40px;
			background-color: #f5f5f5;
		}

		.form-signin {
			width: 100%;
			max-width: 330px;
			padding: 15px;
			margin: auto;
		}
	</style>
	<title>山西农业大学成绩查询</title>
</head>

<body>
	<div class="container">
		<div class="form-signin">
			<h3 class="text-center mb-4 mt-4">登&nbsp;录</h3>
			<div class="form-group">
				<input type="number" class="form-control" id="studentNumber" aria-describedby="学号" placeholder="学号"
					 aria-label="学号">
			</div>
			<div class="form-group">
				<input type="password" class="form-control" id="password" aria-describedby="密码" placeholder="密码"
					 aria-label="密码">
			</div>

			<div class="form-group row">
				<div class="col-8">
					<input type="text" class="form-control" id="captcha" aria-describedby="验证码" placeholder="验证码"
						aria-label="验证码" maxlength="4">
				</div>
				<div class="col-4 m-0 p-0">
					<img alt="验证码" id="captchaShow" style="width:100px" src="" onclick="getCaptcha()">
				</div>
			</div>

			<div class="text-center mt-5">
				<button id="submit" class="btn btn-primary form-control" onclick="login()">登录</button>
			</div>
		</div>
	</div>


	<!-- Optional JavaScript -->
	<!-- jQuery first, then Popper.js, then Bootstrap JS -->
	<script src="./js/jquery.min.js" crossorigin="anonymous"></script>
	<script src="./js/popper.min.js" crossorigin="anonymous"></script>
	<script src="./js/bootstrap.min.js" crossorigin="anonymous"></script>
	<script type="text/javascript">
		getCaptcha();
		$.ajax({
			"url": "login/is_login.action",
			"method": "GET",
			"dataType": "json",
			"success": function (data) {
				if (data['status'] === 1) {
					window.location.href = "current_term.html";
				}
			}
		});

		/**
		 * 获取验证码
		 */
		function getCaptcha() {
			$("#captcha").val("");
			$.ajax({
				"url": "login/captcha.action",
				"method": "POST",
				"dataType": "json",
				"success": function (data) {
					if (data['status'] !== 1) {
						alert(data['data']);
						return;
					}
					$("#captchaShow").attr("src", "captcha/" + data['data']);
				}, "error": function () {
					alert("验证码获取失败");
				}
			})
		}

		function login() {
			let studentNumber = $("#studentNumber").val();
			let password = $("#password").val();
			let captcha = $("#captcha").val();
			if (studentNumber.length !== 11) {
				alert("学号输入有误！");
				return;
			}
			if (captcha.length !== 4) {
				alert("验证码输入有误！");
				return;
			}
			if (password.trim().length === 0) {
				alert("请输入密码！");
				return;
			}
			operateLogin(false);
			$.ajax({
				"url": "login/submit.action",
				"method": "POST",
				"dataType": "json",
				"data": {
					"studentNumber": studentNumber,
					"password": password,
					"captcha": captcha
				},
				"success": function (data) {
					operateLogin(true);
					if (data['status'] !== 1) {
						alert(data['data']);
						$("#captcha").val();
						getCaptcha();
						return;
					}
					window.location.href = "current_term.html";
				},
				"error": function () {
					operateLogin(true);
					alert("登录失败")
				}
			})
		}

		function operateLogin(flag) {
			let loginButton = $("#submit");
			if (flag) {
				loginButton.removeAttr("disabled");
				loginButton.html("登录")
			} else {
				loginButton.attr("disabled", "disabled");
				loginButton.html("登录中...")
			}
		}

	</script>
</body>

</html>